<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="../common.jsp" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<title>订单信息</title>
	<script type="text/javascript">
		var menu_flag = 'inputorder';
		$(function(){
			$("input[id$=Date]").attr("readonly",true);
			$("input[id$=Date]").datepicker({changeYear:true,changeMonth:true});
			//$("#customer").autocomplete({
			//    source: ["深圳鑫远航货运公司", "武汉金武鸭脖公司", "长沙机子"],autoFocus:true,minLength:1
			//});
			//$("input[id$=Date]").datepicker.formatDate('yyyy-mm-dd',new Date());
		});
	</script>
	<script language="javascript" type="text/javascript" src="${ctx}/static/js/jquery.coolfieldset.js"></script>
	<script language="javascript" type="text/javascript" src="${ctx}/static/js/jquery.coolfieldset.js"></script>
	<script language="javascript" type="text/javascript" src="${ctx}/static/js/jquery.autocomplete.js"></script>
	<script language="javascript" type="text/javascript" src="${ctx}/static/js/localdata.js"></script>
	
	
	<link rel="stylesheet" type="text/css" href="${ctx}/static/css/main.css" />
	<link rel="stylesheet" type="text/css" href="${ctx}/static/css/jquery.autocomplete.css" />
	<link rel="stylesheet" type="text/css" href="${ctx}/static/css/jquery.coolfieldset.css" />
</head>
<body>
	
	<div class="sitemap" id="sitemap">
		当前位置: <a href="list">订单</a> -&gt; 新增订单
	</div>
	
	
		<div id="secmainoutside">
			<form id="addForm" action="" method="post">
				<fieldset id="base_info" class="coolfieldset">
				<legend>基本信息</legend>
				<div style="padding:2px">
				<input type="hidden" id="testValue" name="testValue" value=""/>
				<table class="mainadd">
					<tbody>
						<tr>
							<td class="name">MBL号</td>
							<td class="content">
								<input type="text" class="text" id="mblCode" name="mblCode" maxlength='100'/>
								<span class="red">*</span>
							</td>
						
							<td class="name">SO单号</td>
							<td class="content">
								<input type="text" class="text" id="so" name="so" maxlength='50'/>
							</td>
						</tr>
						<tr>
						<td> 整装类型</td>
							<td class="content">
								<input type="radio" name="containerType" id="containerType" value="0"  checked="checked"/>FCL
								<input type="radio" name="containerType" id="containerType" value="1"/>LCL
							</td>
							
						 <td> 客户</td>
							<td class="content">
							 	<select id="customer" name="customer.id" class="companyChoice">
							 	<option value="0">请选择...</option>
									<c:forEach items="${listCompany}" var="company" varStatus="statu">
										<c:if test="${company.type=='zj' }">
											<option value=${company.id }>${company.name }</option>
										</c:if>
									</c:forEach>
								</select>
							</td>
							
							<td>详细</td>
							<td >
								<textarea rows="6" cols="40" id="customerDetail" name="customerDetail"></textarea>
							</td>
						</tr>
						<tr>
						<td>揽货</td>
							<td class="content">
								<input type="radio" name="cargoCollectionType" id="cargoCollectionType" value="1"  checked="checked"/>指定
								<input type="radio" name="cargoCollectionType" id="cargoCollectionType" value="0"/>自揽
							</td>
							
						 <td> 指定代理</td>
							<td class="content">
							
								<input type="text" class="text" id="cargoCollectionAuto" name="cargoCollectionAuto" maxlength='50' class="companyChoice"/>
								<input type="hidden" class="text" id="cargoCollection" name="cargoCollection.id" maxlength='50'/>
							<!-- 
							 <select id="cargoCollection" name="cargoCollection.id" class="companyChoice">
							 	<option value="0">请选择...</option>
									<c:forEach var="company" items="${listCompany}">
										<c:if test="${company.type=='hwdl' }">
											<option value=${company.id }>${company.name }</option>
										</c:if>
									</c:forEach>
								</select>
								 -->
							</td>
							
							<td>详细</td>
							<td >
								<textarea rows="6" cols="40" id="cargoCollectionDetail" name="cargoCollectionDetail"></textarea>
							</td>
						</tr>
						
						<tr>
							<td class="name">发货人</td>
							<td class="content">
								<!-- 
								<input type="text" class="text" id="shipperAuto" name="shipperAuto" maxlength='100'/>
								<input type="hidden" class="text" id="shipper" name="shipper.id" maxlength='100'/>
								 -->
								 <select id="shipper" name="shipper.id" class="companyChoice">
								 <option value="0">请选择...</option>
									<c:forEach var="company" items="${listCompany}">
										<c:if test="${company.type=='fh' }">
											<option value=${company.id }>${company.name }</option>
										</c:if>
									</c:forEach>
								</select>
							</td>
						
					
							<td class="name">收货人</td>
							<td class="content">
								<!-- 
								<input type="text" class="text" id="consigneeAuto" name="consigneeAuto" maxlength='100'/>
								<input type="hidden" class="text" id="consignee" name="consignee.id" maxlength='100'/>
								 -->
								 <select id="consignee" name="consignee.id" class="companyChoice">
								 <option value="0">请选择...</option>
									<c:forEach var="company" items="${listCompany}">
										<c:if test="${company.type=='sh' }">
											<option value=${company.id }>${company.name }</option>
										</c:if>
									</c:forEach>
								</select>
							</td>
							
							<td class="name">通知人</td>
							<td class="content">
								<!-- 
								<input type="text" class="text" id="notifierAuto" name="notifierAuto" maxlength='100'/>
								<input type="hidden" class="text" id="notifier" name="notifier.id" maxlength='100'/>
								 -->
								<select id="notifier" name="notifier.id" class="companyChoice">
								<option value="0">请选择...</option>
									<c:forEach var="company" items="${listCompany}">
										<c:if test="${company.type=='tz' }">
											<option value=${company.id }>${company.name }</option>
										</c:if>
									</c:forEach>
								</select>
							</td>
						</tr>
						<tr>
							<td>发货人详细</td>
							<td >
								<textarea rows="6" cols="40" id="shipperDetail" name="shipperDetail"></textarea>
							</td>
							<td>收货人详细</td>
							<td >
								<textarea rows="6" cols="40" id="consigneeDetail" name="consigneeDetail"></textarea>
							</td>
							<td>通知人详细</td>
							<td >
								<textarea rows="6" cols="40" id="notifierDetail" name="notifierDetail"></textarea>
							</td>
						</tr>
					</tbody>
			</table>
			</div>
			</fieldset>
			
			
			<fieldset id="base_info" class="coolfieldset">
				<legend>港口信息</legend>
				<div style="padding:2px">
				<table class="mainadd">
					<tbody>
						<tr>
							<td class="name">收货地</td>
							<td class="content">
								<input type="text" class="text" id="receiptPlacePauto" name="receiptPlaceDauto" maxlength='100' class="portChoice"/>
								<input type="hidden" class="text" id="receiptPlace" name="receiptPlace.id" maxlength='100'/>
							</td>
						<td class="name">目的地</td>
							<td class="content">
								<input type="text" class="text" id="destinationPlacePauto" name="destinationPlaceDauto" maxlength='50' class="portChoice"/>
								<input type="hidden" class="text" id="destinationPlace" name="destinationPlace.id" maxlength='50'/>
							</td>
						</tr>
						
						<tr>
							<td class="name">起运港</td>
							<td class="content">
								<input type="text" class="text" id="loadingPortPauto" name="loadingPortPauto" maxlength='50'/>
								<input type="hidden" class="text" id="loadingPort" name="loadingPort.id" maxlength='50'/>
							</td>
							<td class="name">卸运港</td>
							<td class="content">
								<input type="text" class="text" id="unloadingPortPauto" name="unloadingPortPauto" maxlength='50'/>
								<input type="hidden" class="text" id="unloadingPort" name="unloadingPort.id" maxlength='50'/>
							</td>
								<td class="name">目的港</td>
							<td class="content">
								<input type="text" class="text" id="destinationPortPauto" name="destinationPortPauto" maxlength='50'/>
								<input type="hidden" class="text" id="destinationPort" name="destinationPort.id" maxlength='50'/>
							</td>
						</tr>
						
						<tr>
						<td class="name">集装箱</td>
							<td class="content">
								<input type="text" class="text" id="containerInfo" name="containerInfo" maxlength='100'/>
							</td>
						</tr>
					</tbody>
			</table>
			</div>
			</fieldset>
			
			<fieldset id="base_info" class="coolfieldset">
				<legend>货物信息</legend>
				<div style="padding:2px">
				<table class="mainadd">
					<tbody>
						<tr>
							<td class="name">大包类型*数目</td>
							<td class="content">
								<input type="text" id="largePackingType" name="largePackingType.id" maxlength='100'/>*
								<input type="text" size="3" id="largeNumber " name="largeNumber"/>
							</td>
						
					
							<td class="name">小包类型*数目</td>
							<td >
								<input type="text" id="smallPackingType" name="smallPackingType.id" maxlength='50'/>*
								<input type="text" size="3" id="smallNumber" name="smallNumber"/>
							</td>

						</tr>
						
						<tr>
							<td class="name">毛重</td>
							<td class="content">
								<input type="text" class="text" id="grossWeight" name="grossWeight" maxlength='50'/>
							</td>
					
							<td class="name">体积</td>
							<td class="content">
								<input type="text" class="text" id="volume" name="volume" maxlength='50'/>
							</td>
						</tr>
						
						<tr>
							<td >中文品名</td>
							<td >
								<textarea rows="6" cols="40" id="chineseName" name="chineseName"></textarea>
							</td>
					
							<td>英文品名</td>
							<td>
								<textarea rows="6" cols="40" id="englishName" name="englishName"></textarea>
							</td>
							
						
						</tr>
						<tr>
						
							<td>唛头</td>
							<td >
								<textarea rows="6" cols="40" id="shippingMark" name="shippingMark"></textarea>
							</td>
							
							<td>总计</td>
							<td >
								<textarea rows="6" cols="40" id="infoSummy" name="infoSummy"></textarea>
							</td>
						</tr>
					</tbody>
			</table>
			</div>
			</fieldset>
			
			<fieldset id="base_info" class="coolfieldset">
				<legend>订舱信息</legend>
				<div style="padding:2px">
				<table class="mainadd">
					<tbody>
					<tr>
						 <td class="name">船名/航次</td>
							<td class="content">
								<input type="text" class="text" id="shippingNameNumber" name="shippingNameNumber" maxlength='50'/>
							</td>
								
							<td class="name">状态</td>
							<td class="content">
								<input type="text" class="text" id="status" name="status" maxlength='50'/>
							</td>
							<td class="name">封箱号</td>
							<td class="content">
								<input type="text" class="text" id="sealingNumber" name="sealingNumber" maxlength='50'/>
							</td>
						</tr>
						<tr>
							<td class="name">订舱日</td>
							<td class="content">
								<input type="text" class="text" id="bookingDate" name="bookingDate" maxlength='100'/>
							</td>
							
							<td class="name">开船日</td>
							<td class="content">
								<input type="text" class="text" id="shippingDate" name="shippingDate" maxlength='50'/>
							</td>
							
							<td class="name">到港日</td>
							<td class="content">
								<input type="text" class="text" id="arrivalDate" name="arrivalDate" maxlength='50'/>
							</td>
						</tr>
						
						<tr>
						
							<td class="name">签发地</td>
							<td class="content">
								<input type="text" class="text" id="issueAddress" name="issueAddress" maxlength='50'/>
							</td>
							
							<td class="name">签发数</td>
							<td class="content">
								<input type="text" class="text" id="issueNumber" name="issueNumber" maxlength='50'/>
							</td>
							
								<td class="name">签发日</td>
							<td class="content">
								<input type="text" class="text" id="issueDate" name="issueDate" maxlength='50'/>
							</td>
						</tr>
					
						<tr>
						 <td class="name">M付款方式</td>
							<td class="content">
							<input type="radio" name="mPaymentType" id="mPaymentType" value="1"/>FREIGHT PREPAID
							<input type="radio" name="mPaymentType" id="mPaymentType" value="2"/>FREIGHT COLLECT
							</td>
							
							<td class="name">H付款方式</td>
							<td class="content">
								<input type="radio" name="hPaymentType" id="hPaymentType" value="1"/>FREIGHT PREPAID
								<input type="radio" name="hPaymentType" id="hPaymentType" value="2"/>FREIGHT COLLECT
							</td>
						</tr>
						
						<tr>
						 <td class="name">M放货方式</td>
							<td class="content">
								<input type="radio" name="mReleaseWay" id="mReleaseWay" value="1"/>电放
								<input type="radio" name="mReleaseWay" id="mReleaseWay" value="2"/>正本提单
								<input type="radio" name="mReleaseWay" id="mReleaseWay" value="3"/>SWB
							</td>
							
							<td class="name">H付款方式</td>
							<td class="content">
								<input type="radio" name="hReleaseWay" id="hReleaseWay" value="1"/>电放
								<input type="radio" name="hReleaseWay" id="hReleaseWay" value="2"/>正本提单
								<input type="radio" name="hReleaseWay" id="hReleaseWay" value="3"/>SWB
							</td>
						</tr>
							<tr>
						 <td>船公司</td>
							<td class="content">
							<!-- 
								<input type="text" class="text" id="shippingCompanyAuto" name="shippingCompanyAuto" maxlength='50'/>
								<input type="hidden" class="text" id="shippingCompany" name="shippingCompany.id" maxlength='50'/>
							-->
								<select id="shippingCompany" name="shippingCompany.id" class="companyChoice">
								 <option value="0">请选择...</option>
									<c:forEach var="company" items="${listCompany}">
										<c:if test="${company.type=='fh' }">
											<option value=${company.id }>${company.name }</option>
										</c:if>
									</c:forEach>
								</select>
							</td>
							
							<td>详细</td>
							<td >
								<textarea rows="6" cols="40" id="shippingCompanyDetail" name="shippingCompanyDetail"></textarea>
							</td>
						</tr>
						
						<tr>
						 <td>订舱代理</td>
							<td class="content">
							<!-- 
								<input type="text" class="text" id="bookingProxyCompanyAuto" name="bookingProxyCompanyAuto" maxlength='50'/>
								<input type="hidden" class="text" id="bookingProxyCompany" name="bookingProxyCompany.id" maxlength='50'/>
								-->
								<select id="bookingProxyCompany" name="bookingProxyCompany.id" class="companyChoice">
								 <option value="0">请选择...</option>
									<c:forEach var="company" items="${listCompany}">
										<c:if test="${company.type=='fh' }">
											<option value=${company.id }>${company.name }</option>
										</c:if>
									</c:forEach>
								</select>
							</td>
							
							<td>详细</td>
							<td >
								<textarea rows="6" cols="40" id="bookingProxyCompanyDetail" name="bookingProxyCompanyDetail"></textarea>
							</td>
						</tr>
						
							<tr>
							<td>运输条款</td>
							<td >
								<textarea rows="6" cols="40" id="transitClause" name="transitClause"></textarea>
							</td>
							
							<td>费用说明</td>
							<td >
								<textarea rows="6" cols="40" id="feeDescription" name="feeDescription"></textarea>
							</td>
							<td>备注</td>
							<td >
								<textarea rows="6" cols="40" id="remark" name="remark"></textarea>
							</td>
							
						</tr>
					</tbody>
			</table>
			</div>
			</fieldset>
			<table>
					<tfoot>
						<tr>
							<td class="name"></td>
							<td class="btn">
								<input type="submit" class="bigbutsubmit" value="提交"  id="butsubmit_id"/>
								<input type="button" class="bigbutsubmit" onclick="javascript:window.location.href='list';" value="返回"/>
							</td>
						</tr>
					</tfoot>
				</table>
			</form>
		</div>
	<script type="text/javascript">
		var option =  {
				minChars: 0,
				max: 12,
				autoFill: true,
				mustMatch: true,
				matchContains: false,
				scrollHeight: 220,
				formatItem: function(row, i, total) {
					return row.value+" "+row.icon;
				},
				 formatResult: function(row)
		     	{
		       		return row.value;
		     	}      
		   };
		   
		$("input[id$=Auto]").click(function(){
			var checkId = $(this).attr('id');
			auto("#"+checkId);
			});

		function auto(checkId){
			$(checkId).autocomplete(projects,option);
			$(checkId).result(function(event, data, formatted)
            {	
                $(checkId.slice(0,checkId.length-4)+"Detail").val(data.value);
            });
		}
	//$(document).ready(function(){
		//		var options = "";
			//	$.each(company_type,function(index, context) {
				//	options += "<option value="+context.code+">"+context.name+"</option>";
			//	});
				//$("#type").html(options);
			//});
			
	//jquery autocomplete控件
	
	
	//jquery UI autocomplete控件
	//============================================
		//选择公司，得到详细信息，填充到详细信息里
	//	$(".companyChoice").change(function(){
//				var cid = $(this).attr('id');
//				alert(cid);
//				var id = $(this).val();
//  				$.ajax({
//					url: "../company/ajaxDataById",
//					data : "id="+id,
//					dataType: "json",
//					async : false,
//					success: function(data) {
//						$("#"+cid+"Detail").val(data.remark);
//					}
//				});
//			});
//		
//		var companys;
//	
//				$.ajax({
//					url: "../company/ajaxData",
//					dataType: "json",
//					async : false,
//					success: function(data) {
//			
//						companys = $.map(data,function(company){
//							return {label:company.name,value:company.name,icon:company.id,desc:company.type};
//						});
//					}
//				});
//			
//	var ports;
//		$.ajax({
//					url: "../port/ajaxData",
//					dataType: "json",
//					async : false,
//					success: function(data) {
//			
//						ports = $.map(data,function(port){
//							return {label:port.name,value:port.name,icon:port.id,desc:port.abbreviate};
//						});
//					}
//				});
//	$(function() {
//		var projects = [
//			{
//				value: "jquery",
//				label: "jQuery",
//				desc: "the write less, do more, JavaScript library",
//				icon: "1"
//			},
//			{
//				value: "jquery-ui",
//				label: "jQuery UI",
//				desc: "the official user interface library for jQuery",
//				icon: "2"
//			},
//			{
//				value: "sizzlejs",
//				label: "Sizzle JS",
//				desc: "a pure-JavaScript CSS selector engine",
//				icon: "3"
//			}
//		];
//		
//	$("input[id$=Auto]").click(function(){
//			$(this).autocomplete("search", "");
//			});
//			//鼠标离开输入框操作
	//$("input[id$=Auto]").focusout(function(){
	//		var checkId = $(this).attr('id');
	//		alert("blur:"+checkId);
		//	});
	
//	$("input[id$=Auto]").autocomplete({
//			minLength: 0,
//			source: companys,
//			select: function(event, ui ) {
//				var checkId = $(this).attr('id');
//				var checkValue = checkId.slice(0,checkId.length-4);
//				$("#"+checkValue+"Auto").val(ui.item.label);
//				$("#"+checkValue).val(ui.item.icon);
//				$("#"+checkValue+"Detail").val(ui.item.label);
//				return false;
//			},
//			close: function() {
//				var checkId = $(this).attr('id');
//				var checkValue = checkId.slice(0,checkId.length-4);
//				if($("#"+checkValue).val()==""){
//					$("#"+checkValue+"Auto").val("");
//				};
//			}
//		})
//		
		
		//港口
		
		//$("input[id$=Pauto]").click(function(){
		//	alert("auto");
			//$(this).autocomplete("search", "");
		//	});
//		var choiceInput = false;
//		$("input[id$=Pauto]").autocomplete({
//			delay: 0,
//			minLength: 0,
//			source: ports,
//			select: function(event, ui) {
//				var checkId = $(this).attr('id');
//				var checkValue = checkId.slice(0,checkId.length-5);
//				$("#"+checkValue).val(ui.item.icon);
//				$("#"+checkValue+"Pauto").val(ui.item.label);
//				choiceInput = true;
//				return false;
//			},
//			close: function() {
//				var checkId = $(this).attr('id');
//				var checkValue = checkId.slice(0,checkId.length-5);
//				//if($("#"+checkValue).val()==""){
//				//	$("#"+checkValue+"Pauto").val("");
//				//};
//				if(!choiceInput||$("#"+checkValue).val()==""){
//					$("#"+checkValue+"Pauto").val("");
//				}
//			}
//		})
//
//	});

	$(document).ready(function(){
		$("#addForm").validate({
			rules: {
				
			},
			messages: {
				
			},
			errorPlacement: function(error, element){
			
			},
			submitHandler: function(form) {
				$("#butsubmit_id").attr("disabled","true");
				setDisabled('input[type="submit"]', window.document)
				$(form).ajaxSubmit({
					 success: function(response){
		        		var data = eval("("+response+")");
		        		if(data.flag==0){
	            			$.alert('添加订单成功', function(){window.location.href = "add";});
	            		}else{
	                		$.alert('添加失败,请重新输入');
	                		$("#butsubmit_id").attr("disabled","false");
	            		}
		        		setabled('input[type="submit"]', window.document);
		            }
	            });
			},
			success: function(label){
				var labelparent = label.parent();
				label.parent().html(labelparent.next().html()).attr("class", "valid");
			},
			onkeyup:false
		});
			
	});
	</script>
</body>
</html>